<!DOCTYPE html>
<html>
<head>
<title>很快乐的滑稽</title>
<style> 
div
{
	width:800px;
	height:800px;
	background:white;
	position:relative;
	animation-name:滑稽;
	animation-duration:10s;
	animation-timing-function:linear;
	animation-delay:0s;
	animation-iteration-count:infinite;
	animation-direction:alternate;
	animation-play-state:running;
	/* Safari and Chrome: */
	-webkit-animation-name:滑稽;
	-webkit-animation-duration:5s;
	-webkit-animation-timing-function:linear;
	-webkit-animation-delay:0s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-direction:alternate;
	-webkit-animation-play-state:running;
}



@keyframes 滑稽
{
	0%   {background:white; left:0px; top:0px;}
	25%  {background:white; left:500px; top:250px;}
	50%  {background:white; left:200px; top:200px;}
	75%  {background:white; left:400px; top:500px;}
	100% {background:white; left:300px; top:300px;}
}

@-webkit-keyframes 滑稽 
{
	0%   {background:white; left:0px; top:0px;}
	25%  {background:white; left:200px; top:300px;}
	50%  {background:white; left:200px; top:400px;}
	75%  {background:white; left:700px; top:210px;}
	100% {background:white; left:900px; top:300px;}
}
</style>
</head>
<body>


<div><svg id="svg" xmlns="http://www.w3.org/2000/svg" version="1.1" width="800" height="500">
			<!--face-->
			<circle cx="100" cy="100" r="90" style="fill: #f8dc0ee6;" />
			<!--eyes-->
			<ellipse style="fill: white;stroke: #b4b40180;stroke-width:5;" cy="50" rx="40" cx="55" ry="7" />
			<ellipse style="fill: white;stroke: #b4b40180;stroke-width:5;" cy="50" rx="40" cx="140" ry="7" />
			<circle fill="black" cx="30" cy="50" r="6" />
			<circle cx="125" fill="black" cy="50" r="6" />
			<ellipse style="fill: #f2863880;" cy="70" rx="30" cx="40" ry="7" />
			<ellipse style="fill: #f2863880;" cy="70" cx="160" rx="25" ry="7" />
			<!--smile-->
			<path fill="none" stroke="black" d="M 25 110 A 80 85 0 0 0 175 110" stroke-width="5"></path>
			<rect id="viewBoxIndicator" stroke="red" stroke-width="3.5" fill="black" />
		</svg>
</div>

</body>
</html>